<!doctype html>
<html xmlns:th="http://www.thymeleaf.org" >

	<head>
		<meta charset="utf-8">
		<title>系统管理-群组列表</title>
		<link href="../c/base.css" rel="stylesheet" type="text/css">
		<link href="../c/toefl.css" rel="stylesheet" type="text/css">
		<link href="../c/bootstrap.min.css" rel="stylesheet" type="text/css">
		<link href="../alert/Fytx_Tips.css" rel="stylesheet" type="text/css" />
		<script type="text/javascript" src="../j/jquery-2.1.0.js"></script>
		<script type="text/javascript" src="../j/bootstrap.min.js"></script>
		<script type="text/javascript" src="../j/lrtk.js"></script>
		<!--配置样式（也可以默认使用）-->
		<script type="text/javascript" src="../alert/Fytx_Tips_Config.js"></script>
		<!--美化脚本程序-->
		<script type="text/javascript" src="../alert/Fytx_Tips.js"></script>
	</head>
	<style>
		.nowPage {
			color: red;
		}
	</style>
	<body>

		<div class="doc1180 paddingT20 fn-clear container">

			<div>
				<form class="form-inline" action="/togrouplist" method="post" id="groupform">
					<input type="hidden" name="pageNum" id="pageNum" th:value="${session.grouplist.pageNum}">
					<div class="form-group">
						<label for="">群名称</label>
						<input type="text" name="group_name" id="groupname" class="form-control" th:value="${session.schval.group_name}" placeholder="群聊名">
					</div>
					<div class="form-group">
						<label for="">创建日期</label>
						<input type="date" class="form-control" id="createtime" name="create_time" th:value="${session.schval.create_time}">
					</div>
					<button type="submit" class="btn btn-primary">搜索</button>
				</form>

			</div>
			<div class="myPost_Theme" style="height: 80vh;margin-top: 50px;">
				<table width="100%" border="0" cellspacing="0" cellpadding="0" class="myPost_Table">
					<tr class="myPost_Th">
						<th><input type="checkbox"  id="checkAll" name="checkAll" /></th>
						<th>标题</th>
						<th>描述</th>
						<th>创建日期</th>
						<th>创建人</th>
						<th>群组人数</th>
						<th>管理员人数</th>
					</tr>
					<div th:each="g,gStat :${session.grouplist.list}">
					<tr id="data_0">
						<td><input type="checkbox" name="" th:id="'box_'+${gStat.index}" th:value="${g.group_id}" /></td>
						<td>
							[[${g.group_name}]]
						</td>
						<td>
							[[${g.group_desc}]]
						</td>
						<td>[[${#dates.format(g.create_time,"yyyy-MM-dd")}]]</td>
						<td>[[${g.teacher.login_name}]]</td>
						<td>[[${g.count}]]</td>
						<td>[[${g.admincount}]]</td>
					</tr>
					</div>
				</table>

				<div class="pageList" style="width: 500px;float: right;">
					<ul>
						<li th:if="${session.grouplist.pageNum != 1}"><a href="###"
																		  onclick="searchGroup(1)">首页</a></li>
						<li th:each="pages:${session.grouplist.navigatepageNums}"><a href="###"
																					  th:class="${pages == session.grouplist.pageNum} ? nowPage : ''"
																					  th:onclick="searchGroup([[${pages}]],  [[${session.schval.group_name}]],[[${session.schval.create_time}]])">【[[${pages}]]】</a></li>
						<li th:if="${session.grouplist.pageNum != session.grouplist.pages}"><a
								href="###"
								th:onclick="searchGroup([[${session.grouplist.pages}]], [[${session.schval.group_name}]],[[${session.schval.create_time}]])">最后一页</a></li>
						<li th:if="${session.grouplist.pageNum != 1}"><a href="###"
																		  class="pret"
																		  th:onclick="searchGroup([[${session.grouplist.prePage}]], [[${session.schval.group_name}]],[[${session.schval.create_time}]])">上一页</a></li>
						<li th:if="${session.grouplist.pageNum != session.grouplist.pages}"><a
								href="###" class="next"
								th:onclick="searchGroup([[${session.grouplist.nextPage}]], [[${session.schval.group_name}]],[[${session.schval.create_time}]])">下一页</a></li>
					</ul>
				</div>

				<div id="" class="" style="margin-top: 40px;width: 400px; float: left;">
					<a href="#" class="btn btn-danger" id="delete">关闭</a>
				</div>
			</div>

		</div>
		<script type="text/javascript">
			function searchGroup(pageNum,group_name,create_time){
				$("#pageNum").val(pageNum);
				$("#createtime").val(create_time);
				$("#groupname").val(group_name);
				$("#groupform").submit();
			}

			$(function(){
				/** 获取上一次选中的部门数据 */
				var boxs  = $("input[type='checkbox'][id^='box_']");

				/** 给全选按钮绑定点击事件  */
				$("#checkAll").click(function(){
					// this是checkAll  this.checked是true
					// 所有数据行的选中状态与全选的状态一致
					boxs.prop("checked",this.checked);
				})

				/** 给数据行绑定鼠标覆盖以及鼠标移开事件  */
				$("tr[id^='data_']").hover(function(){
					$(this).css("backgroundColor","#eeccff");
				},function(){
					$(this).css("backgroundColor","#ffffff");
				})


				/** 删除员工绑定点击事件 */
				$("#delete").click(function(){
					/** 获取到用户选中的复选框  */
					var checkedBoxs = boxs.filter(":checked");
					if(checkedBoxs.length < 1){
						$.alert("","请选择需要关闭的群组!");
					}else{
						/** 得到用户选中的所有的需要删除的ids */
						var ids = checkedBoxs.map(function(){
							return this.value;
						})

						$.confirm("确认要关闭吗?","关闭群组");
						$.isok=function(){
							window.location = "deleteGroups?ids=" + ids.get();
						}

							}
						});
			})
		</script>
	</body>

</html>